<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="UTF-8">
    <title>菜单管理--右边列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="icon" href="/favicon.ico">
    <link rel="stylesheet" href="/resources/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="/resources/css/public.css" media="all" />
    <link rel="stylesheet" href="/resources/layui_ext/dtree/dtree.css" media="all" />
    <link rel="stylesheet" href="/resources/layui_ext/dtree/font/dtreefont.css" media="all" />
<!--<style>

    /* 防止下拉框的下拉列表被隐藏-&#45;&#45;必须设置-&#45;&#45; */
    .layui-table-cell{            overflow: visible !important;        }
    /* 使得下拉框与单元格刚好合适 */
    td .layui-form-select{
        margin-top: -10px;
        margin-left: -15px;
        margin-right: -15px;
    }
</style>-->
</head>
<body class="childrenBody">

<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
    <ul class="layui-tab-title">
        <li >病历信息</li>
        <li class="layui-this">医嘱信息</li>
        <li>附件管理</li>

    </ul>

    <div class="layui-tab-content">
        <!--病历信息开始-->
        <div class="layui-tab-item ">
            病历信息
        </div>
        <!--病历信息结束-->
        <!--医嘱信息开始-->
        <div class="layui-tab-item layui-show">
        <blockquote class="layui-elem-quote"  style="margin-top: 5px;">基本信息</blockquote>

            <div style="padding: 5px" id="patientinfo">
                <form action="" method="post" class="layui-form layui-form-pane" id="patientdataFrm" lay-filter="patientdataFrm">
                    <div class="layui-form-item">
                        <label class="layui-form-label">档案编号</label>
                        <div class="layui-input-block">
                            <input type="hidden" name="id" id="patientid" th:value="${patientid}">
                            <input type="text" name="filenum" autocomplete="off"
                                   placeholder="请输入档案编号" class="layui-input" style="width: 75.4%">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">*姓名</label>
                            <div class="layui-input-inline">
                                <input type="text" name="patientname" lay-verify="required" autocomplete="off" placeholder="请输入姓名" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-inline">
                            <label class="layui-form-label">性别</label>
                            <div class="layui-input-inline">
                                <input type="radio" name="sex" value="1" title="男" >
                                <input type="radio" name="sex" value="0" title="女" >
                            </div>
                        </div>

                        <div class="layui-inline">
                            <label class="layui-form-label">*年龄</label>
                            <div class="layui-input-inline">
                                <input type="text" name="age" lay-verify="required" autocomplete="off" placeholder="请输入年龄" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">身份证号</label>
                            <div class="layui-input-inline">
                                <input type="text" name="idcardnum" lay-verify="required" autocomplete="off" placeholder="请输入身份证号" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">联系电话</label>
                            <div class="layui-input-inline">
                                <input type="text" name="phone" lay-verify="required" autocomplete="off" placeholder="请输入联系电话" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">体重(KG)</label>
                            <div class="layui-input-inline">
                                <input type="text" name="weight" autocomplete="off" placeholder="请输入体重" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">出生日期</label>
                            <div class="layui-input-inline">
                                <input type="text" name="birth" readonly="readonly"  id="birth" autocomplete="off" placeholder="请输入出生日期" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">紧急联系人</label>
                            <div class="layui-input-inline">
                                <input type="text" name="contacts" autocomplete="off" placeholder="请输入紧急联系人" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">紧急联系人电话</label>
                            <div class="layui-input-inline">
                                <input type="text" name="contactsphone" autocomplete="off" placeholder="请输入紧急联系人电话" class="layui-input">
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">地址</label>
                        <div class="layui-input-block">
                            <input type="text" name="address" autocomplete="off"
                                   placeholder="请输入公司地址" class="layui-input" style="width: 75.4%">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">备注</label>
                        <div class="layui-input-block">
                            <input type="text" name="remarks" autocomplete="off"
                                   placeholder="请输入备注" class="layui-input" style="width: 75.4%">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">过敏史</label>
                            <div class="layui-input-inline">
                                <input type="radio" name="allergy" value="1" title="是" >
                                <input type="radio" name="allergy" value="0" title="否" checked="">
                            </div>
                        </div>
                    </div>
                </form>
            </div>

            <blockquote class="layui-elem-quote"  style="margin-top: 5px;">医嘱信息</blockquote>
            <div style="padding: 5px" id="treatinfo">
                <form action="" method="post" class="layui-form layui-form-pane" id="treatdataFrm" lay-filter="treatdataFrm">
                    <div class="layui-form-item">
                        <label class="layui-form-label">输入诊断</label>
                        <div class="layui-input-block">
                            <input type="hidden" name="id"><!--诊断表id-->
                            <input type="text" name="输入诊断" autocomplete="off"
                                   placeholder="请输入诊断,下拉" class="layui-input" style="width: 75.4%">
                        </div>
                    </div>
                    <!-- 数据表格开始 -->
                    <div>
                        <table class="layui-hide" id="treatTable" lay-filter="treatTable"></table>
                        <div id="treatToolBar" style="display: none;">
                            <button type="button" lay-event="add" class="layui-btn layui-btn-sm"><span class="layui-icon layui-icon-add-1"></span>添加</button>
                            <button type="button" lay-event="batchDelete" class="layui-btn layui-btn-sm layui-btn-danger"><span class="layui-icon layui-icon-delete"></span>批量删除</button>
                        </div>
                        <div id="treatRowBar" style="display: none;">
                            <button type="button" lay-event="update" class="layui-btn layui-btn-sm"><span class="layui-icon layui-icon-edit"></span>更新/查看</button>
                            <button type="button" lay-event="delete" class="layui-btn layui-btn-sm layui-btn-danger"><span class="layui-icon layui-icon-delete"></span>删除</button>
                        </div>
                    </div>
                    <!-- 数据表格结束 -->
                </form>
            </div>


        </div>

        <!--医嘱信息结束-->
        <!--附件管理开始-->
        <div class="layui-tab-item">
            附件管理
        </div>
        <!--附件管理结束-->
    </div>
</div>



<script type="text/javascript" src="/resources/layui/layui.js"></script>
<script type="text/html" id="patientnamex">
    <select name="patientnamex" lay-filter="patientnamex" lay-search="" data-value="{{d.patientname}}"></select>
</script>
<script type="text/javascript">
    var tableIns;
    layui.use(['jquery','form','table','layer','element'],function(){
        var $=layui.jquery;
        var form=layui.form;
        var table=layui.table;
        var layer=layui.layer;
        var element=layui.element;
        var patientid = $("#patientid").val();//提取患者id
        //初始化基本信息
        if(patientid != 0 ){
            $.get("/patient/loadAllPatient",{id:patientid},function(res){
                var res = res.data[0];
                //装载新的数据
                form.val("patientdataFrm",res);
                form.render();
            });
            $("#patientid").val("");
        }
        var initdata ={ "id": "" ,"patientname": "","idcardnum": "","address": ""}
        var array = [].concat(initdata);
        //加载 数据
        //修理项目==》Table
        tableIns=table.render({
            elem: '#treatTable'
           // ,url:'/patient/loadAllPatient'
            ,data:array
            ,toolbar: '#treatToolBar' //开启头部工具栏，并为其绑定左侧模板
            ,title: '患者数据表'
            ,height:'full-80'
            ,page: true
            ,cols: [ [
                {type:'checkbox',align:'center'}
                ,{type:'numbers',title:'序号',align:'center',width:'80'}
                ,{field:'id', title:'ID',align:'center' ,width:'80',hide:true}
                ,{field:'patientname', title:'患者名字',align:'center',width:'200', templet:'#patientnamex'}
                ,{field:'idcardnum', title:'身份证号',align:'center',width:'200'}
                ,{field:'address', title:'患者地址',align:'center',width:'100'}
                ,{fixed: 'right', title:'操作', toolbar: '#treatRowBar',align:'center',width:'200'}
            ] ]
            ,done: function (res, curr, count) {
               /* tabledata = res.data;
                alert(tabledata);*/
                $.ajax({
                    //修理项目拼接下拉选项
                    type: "post",
                    url: "/patient/loadAllPatient",
                    dataType: "json",
                    async: false,
                    success: function (data) {
                      //  alert(data.data[0].id);
                        var data = data.data;
                        for (k in data) {
                            $("select[name='patientnamex']").append('<option value="' + data[k].id + '">' + data[k].patientname+ '</option>');
                        }
                    }
                });

                //根据已有的值回填修理项目下拉框
                layui.each($("select[name='patientnamex']", ""), function (index, item) {
                    var elem = $(item);
                    elem.val(elem.data('value'));
                });
                form.render('select');
            }
        })

        //监听工具条的事件
        table.on("toolbar(treatTable)",function(obj){
            switch(obj.event){
                case 'add':
                   var test = $("select[name='patientnamex']").val();
                   alert(test);
                  addarry();
                    break;
                case 'batchDelete':
                    alert('batchDelete')
                    break;
            };
        });

        //插入对象
        function addarry(){
            array.push(initdata);
            tableIns.reload({
                data:array
            });
        }
        //监听行工具条的事件
        table.on("tool(treatTable)",function(obj){
            var data = obj.data; //获得当前行整个对象的数据
            switch(obj.event){
                case 'update':
                    alert('update')
                    break;
                case 'delete':
                    alert('delete')
                    break;
            };
        });












    });

</script>

</body>
</html>